<template>
	<view class="pageItem">
		<view class="bg_img">
			<image class="b_img" src="../../static/depot/bg.png"></image>
		</view>
		<view class="depot_A" v-for="(item,index) in data" :key="'re_g_'+index" v-if="item.js==0">
			<image class="a_bg_img" src="../../static/depot/bg_03.png"></image>
			<view class="a_main">
				<view class="a_tit">{{item.name}}总积分</view>
				<view class="a_txt1">{{item.y}}<label class="a_t1_t">积分</label></view>
				<view class="a_txt2">
					<!-- <view class="a_t2">
						日释放 <label class="a_t2_t">{{item.sf_bl}}
						<block v-if='item.sf==1'>%</block>
						<block v-else>元</block></label>
					</view> -->
					<view class="a_t2" v-if="item.sf==1">
						今日释放 <label class="a_t2_t">{{item.jr}}</label>
					</view>
					<view class="a_t2" v-if="item.sf==2">
						今日释放 <label class="a_t2_t">{{item.jr}}</label>
					</view>
					<view class="a_t2" v-if="item.sf==3">
						<block v-if="item.dd">还需{{item.dd}}日释放，预计收益：{{item.dq_money}},</block>
						今日释放 <label class="a_t2_t">{{item.jr}}</label>
					</view>
				</view>
			</view>
		</view>
		<!-- <view class="depot_B">
			<image class="b_bg_img" src="../../static/depot/no_msg.png" mode="widthFix"></image>
			<view class="d_b_txt">B仓暂未开放</view>
		</view> -->
<!-- 		<view class="d_title">总锁仓</view>
		<view class="depot_C" v-for="(item,index) in data" :key="'re_g_'+index" v-if="item.js==1">
			<view class="bg_box">
				<image class="c_bg_img" src="../../static/depot/bg_03.png"></image>
				<view class="c_main">
					<view class="c_b_t1">{{item.name}}总积分</view>
					<view class="c_b_t2">
						{{item.y}} <label class="t2">积分</label>
					</view>
				</view>
			</view>
			<view class="total">
				<view class="t_box">
					<view class="t_t1">{{item.sf_bl}}
					<block v-if='item.sf==1'>%</block> 
					<block v-else>元</block></view>
					<view class="t_t2">日释放</view>
				</view>
				<view class="t_box">
					<view class="t_t1">{{item.jr}}</view>
					<view class="t_t2">今日释放</view>
				</view>
				<view class="t_box">
					<view class="t_t1">{{item.js_sf}}</view>
					<view class="t_t2">今日加速</view>
				</view>
			</view>
		</view> -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				data:[]
			}
		},
		onShow() {
			let me = this;
			me.Net._get('cw_List',{},(res)=>{
				if(res.code ==1){
					console.log(res.data)
					me.data=res.data
				
				}
			});
			
		},
		methods: {
			
		}
	}
</script>

<style lang="scss">
.bg_img{
	position: fixed;
	left: 0;
	width: 100%;
	z-index: 1;
	.b_img{
		width: 100%;
		height: 30vw;
	}
}
.depot_A{
	position: relative;
	width: 100%;
	padding: 20rpx 4% 0;
	z-index: 2;
	.a_bg_img{
		position: absolute;
		width: 92%;
		height: 40vw;
		z-index: 3;
	}
	.a_main{
		position: relative;
		z-index: 4;
		width: 90%;
		height: 40vw;
		padding: 5vw 5%;
		.a_tit{
			width: 100%;
			color: #ffffff;
			font-size: 30rpx;
			line-height: 6vw;
		}
		.a_txt1{
			height: 18vw;
			display: flex;
			align-items: center;
			color: #ffffff;
			font-size: 10vw;
			font-weight: bold;
			.a_t1_t{
				font-size: 30rpx;
				font-weight: 500;
				padding-left: 30rpx;
				padding-top: 3vw;
			}
		}
		.a_txt2{
			width: 100%;
			display: flex;
			.a_t2{
				width: 100%;
				color: #ffffff;
				font-size: 30rpx;
				line-height: 6vw;
				.a_t2_t{
					
				}
			}
		}
	}
}
.depot_B{
	width: 92%;
	margin-left: 4%;
	padding: 30rpx;
	background: #ffffff;
	border-radius: 25rpx;
	text-align: center;
	position: relative;
	z-index: 2;
	.b_bg_img{
		width: 40vw;
	}
	.d_b_txt{
		font-size: 30rpx;
		padding-top: 30rpx;
	}
}
.d_title{
	width: 100%;
	padding: 30rpx 4% 25rpx 8%;
	font-size: 32rpx;
	font-weight: bold;
	position: relative;
	z-index: 2;
	&:before{
		content: '';
		position: absolute;
		left: 4%;
		height: 40%;
		width: 10rpx;
		background: #FF0200;
		border-radius: 8rpx;
		top: 30%;
	}
}
.depot_C{
	position: relative;
	z-index: 2;
	width: 100%;
	padding: 0 4% 50rpx;
	.bg_box{
		width: 100%;
		position: relative;
		padding: 6vw 5%;
		.c_bg_img{
			position: absolute;
			z-index: 3;
			width: 100%;
			height: 30vw;
			top: 0;
			left: 0;
		}
		.c_main{
			position: relative;
			z-index: 4;
			height: 18vw;
			color: #ffffff;
			.c_b_t1{
				height: 4vw;
				line-height: 4vw;
				font-size: 30rpx;
			}
			.c_b_t2{
				height: 14vw;
				display: flex;
				align-items: flex-end;
				font-size: 10vw;
				font-weight: bold;
				.t2{
					font-size: 30rpx;
					font-weight: 500;
					padding-left: 30rpx;
					padding-bottom: 2vw;
				}
			}
		}
	}
	.total{
		width: 100%;
		padding: 80rpx 5% 30rpx;
		border-radius:0 0 25rpx 25rpx;
		margin-top: -50rpx;
		background: #ffffff;
		display: flex;
		align-items: center;
		.t_box{
			flex: 1;
			text-align: center;
			.t_t1{
				font-size: 32rpx;
				font-weight: bold;
				color: #FF0200;
			}
			.t_t2{
				font-size: 30rpx;
				color: #999999;
				padding-top: 15rpx;
			}
		}
	}
}
</style>
